<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>编辑用户</title>
    <link rel="stylesheet" href="layui/css/layui.css">
    <link rel="stylesheet" href="css/css.css"/>
</head>
<body>
<div class="edituser">
    <form class="login layui-form" style="margin-top: 10px">
        <input type="hidden" name="id" id="id"/>
        <div class="user-name layui-form-item">
            <i class="layui-icon layui-icon-username"></i>
            <input name="loginName" id="loginName" placeholder='登录名' maxlength="16" required lay-verify='required|username'
                   class="layui-input"/>
        </div>
        <div class="layui-form-item">
            <i class="layui-icon layui-icon-password"></i>
            <input name="oldPass" placeholder='原密码' id="oldPass" type="password" required lay-verify="required|pass|oldPass"
                   class="layui-input"/>
        </div>
        <div class="layui-form-item">
            <i class="layui-icon layui-icon-password"></i>
            <input name="password" placeholder='新密码' type="password" required lay-verify="required|pass|confirmPwd"
                   class="layui-input"/>
        </div>
        <div class="layui-form-item">
            <button class="layui-btn layui-btn-fluid" lay-submit lay-filter="save">保存</button>
        </div>
    </form>
</div>
</body>
<script src="layui/layui.js"></script>
<script src="js/common.js" charset="utf-8"></script>
<script src="js/md5.js"></script>
<script>
    layui.use(['table', 'layer', 'jquery', 'form'], function () {
        var  layer = layui.layer,
                form = layui.form,
                $ = layui.jquery;

        form.verify({

            username: function (value, item) {//value：表单的值、item：表单的DOM对象
                if (!new RegExp("^[a-zA-Z]+$").test(value)) {

                    return '用户名只能使用英文';

                }
                if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){
                    return '用户名不能有特殊字符';
                }
                if(/(^\_)|(\__)|(\_+$)/.test(value)){
                    return '用户名首尾不能出现下划线\'_\'';
                }
                if(/^\d+\d+\d$/.test(value)){
                    return '用户名不能全为数字';
                }
            }
            ,oldPass:function (value, item) {//原始密码验证 value：表单的值、item：表单的DOM对象
                var pass;

                //发送原始密码校验请求
                doAjax($,layer,'POST',false,{"id":$("input[name=id]").val(),"password":value},'/user/checkPass',afterPass);

                //原始密码校验之后的回调函数
                function afterPass(result) {
                    if (result.status == '200') {
                        pass = true;
                    }else{
                        pass = false;
                    }
                }

                if (!pass){
                    return "原始密码输入错误";
                }
            }
            ,pass: [
                /^[\S]{6,12}$/
                ,'密码必须6到12位，且不能出现空格'
            ]
            ,confirmPwd : function(value, item){
                if(new RegExp($("#oldPass").val()).test(value)){
                    return "新密码不能和就密码一样!";
                }
            }
        });

        form.on('submit(save)', function (data) {

            var field = data.field;

            //Md5加密
            field.password = hex_md5(field.password);

            //发送编辑请求
            doAjax($,layer,'POST',false,field,'user/updatePass',afterEdit);

            //编辑成功回调函数
            function afterEdit(result) {
                if (result.status == "200") {
                    //编辑成功的提示与跳转
                    layer.msg('编辑成功', {
                        icon: 1
                        ,time: 1500
                    }, function(){
                        //iframe页面关闭自身
                        var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                        parent.layer.close(index); //再执行关闭
                    });

                }else{
                    layer.msg(result.msg);
                }
            }

            return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。

        })
    })
</script>
</html>
